﻿@using CRM.Admin.Areas.Customer.Controllers
@using CRM.Admin.Contracts.Dto.Sys
@{
    ViewBag.Title = "CompetitorAdd";
}
@section head
{
   <link href="@Url.Content("~/ScriptPlugin/easyui/themes/gray/easyui.css")" rel="stylesheet" />
<link href="@Url.Content("~/ScriptPlugin/easyui/themes/icon.css")" rel="stylesheet" />
<script type="text/javascript" src="@Url.Content("~/ScriptPlugin/easyui/jquery.easyui.min.js")"></script>
<script type="text/javascript" src="@Url.Content("~/ScriptPlugin/easyui/locale/easyui-lang-zh_CN.js")"></script>
<script type="text/javascript" src="@Url.Content("~/ScriptPlugin/xlayer/extend/layer.ext.js")"></script>
<script type="text/javascript" src="@Url.Content("~/Scripts/KingsSharp.DataGrid.Filter.js")"></script>
<script src="@Url.Content("~/ScriptPlugin/WdatePicker/js/WdatePicker.js")"></script>
<script type="text/javascript" src="@Url.Content("~/Scripts/form2json.js")"></script>
<script type="text/javascript" src="@Url.Content("~/Scripts/jquery.validate.min.js")"></script>
<script type="text/javascript" src="@Url.Content("~/Scripts/jquery.validate.extended.js")"></script>
<script type="text/javascript" src="@Url.Content("~/Scripts/picdata.js")"></script>
<script src="@Url.Content("~/Scripts/jquery.linq.min.js")"></script>
<script type="text/javascript" src="@Url.Content("~/ScriptPlugin/webuploader/webuploader.js")"></script>
<script type="text/javascript" src="@Url.Content("~/Scripts/KingsSharp.Uploader.js")"></script>
  <style type="text/css">
    .uploader {
        text-align: center;
        float: left;
        width: 50px;
        height: 32px;
        line-height: 32px;
        color: blue;
    }

    .uploader-show {
        float: left;
        width: 70%;
        line-height: 32px;
    }

        .uploader-show a {
            margin-right: 5px;
            color: green;
        }

        .uploader-show img {
            width: 100%;
            height: 32px;
        }

            .uploader-show img.mulit {
                width: 32px;
                height: 32px;
                padding-right: 5px;
                border: 1px solid #fff;
                margin-left: 3px;
            }

            .uploader-show img.red {
                border: 1px solid red;
            }

        .uploader-show .imgBox .removeImg {
            margin-top: 9px;
            display: block;
            width: 40px;
            float: left;
            text-align: center;
        }

        .uploader-show .imgBox .hongcha {
            position: absolute;
            width: 13px !important;
            height: 13px !important;
            right: -10px;
            top: -5px;
            display: none;
        }

        .uploader-show .imgBox:hover .hongcha {
            display: block;
            cursor: pointer;
        }

        .uploader-show .imgBox {
            position: relative;
            width: 32px;
            float: left;
            margin-left: 10px;
        }
</style>
}


<form action="" id="CompetitorAddform">
    <div class="content-form" id="content-form">
        <table class="content-table">
            <tr>
                <th><span>竞争对手名称</span></th>
                <td>
                    <input type="hidden" id="CustomerId" name="CustomerId" value="@ViewBag.CustomerId" />
                    <input type="text" data-rule-required="true" id="Name" name="Name" />
                </td>

                <th><span>排序</span></th>
                <td>
                    <input type="text" data-rule-number="true" data-rule-required="true" value="0" id="Order" name="Order"/>

                    <div style="display: none">
                        <div id="pickerzero" class="uploader">
                            上传
                        </div>
                        <div class="uploader-show" data-mulit="true">

                        </div>
                    </div>
                </td>
            </tr>

            <tr>
                <th >产品质量水平</th>
                <td>
                    <textarea rows="2" type="text" maxlength="200" id="ProQualityLevel" name="ProQualityLevel"></textarea>
                </td>
                <th>附件</th>
                <td>
                    <input type="hidden" id="ProQualityLevelPath" name="ProQualityLevelPath"/>

                    <div id="picker1" class="uploader" data-type="file">
                        上传
                    </div>
                    <div class="uploader-show" data-mulit="true">

                    </div>
                </td>
            </tr>
            <tr>
                <th>合同交货情况</th>
                <td>
                    <textarea rows="2" type="text" maxlength="200" id="ContractDelivery" name="ContractDelivery"></textarea>
                </td>
                <th>附件</th>
                <td>
                    <input type="hidden" id="ContractDeliveryPath" name="ContractDeliveryPath" />
                    <div id="picker2" class="uploader" data-type="file">
                        上传
                    </div>
                    <div class="uploader-show" data-mulit="true">

                    </div>
                </td>
            </tr>
            <tr>
                <th>主要营销策略</th>
                <td>
                    <textarea rows="2" type="text" maxlength="200" id="MarketStrategy" name="MarketStrategy"></textarea>
                </td>
                <th>附件</th>
                <td>
                    <input type="hidden" id="MarketStrategyPath" name="MarketStrategyPath" />
                    <div id="picker3" class="uploader" data-type="file">
                        上传
                    </div>
                    <div class="uploader-show" data-mulit="true">

                    </div>
                </td>
            </tr>
            <tr>
                <th>顾客供货关系</th>
                <td>
                    <textarea rows="2" type="text" maxlength="200" id="SupplyRelation" name="SupplyRelation"></textarea>
                </td>
                <th>附件</th>
                <td>
                    <input type="hidden" id="SupplyRelationPath" name="SupplyRelationPath" />
                    <div id="picker4" class="uploader" data-type="file">
                        上传
                    </div>
                    <div class="uploader-show" data-mulit="true">

                    </div>
                </td>
            </tr>
            <tr>
                <th>供货简介</th>
                <td>
                    <textarea rows="2" type="text" maxlength="200" id="SupplyDesc" name="SupplyDesc"></textarea>
                </td>
                <th>附件</th>
                <td>
                    <input type="hidden" id="SupplyDescPath" name="SupplyDescPath" />
                    <div id="picker5" class="uploader" data-type="file">
                        上传
                    </div>
                    <div class="uploader-show" data-mulit="true">

                    </div>
                </td>
            </tr>
            <tr>
                <th>存在问题</th>
                <td>
                    <textarea rows="2" type="text" maxlength="200" id="Problem" name="Problem"></textarea>
                </td>
                <th>附件</th>
                <td>
                    <input type="hidden" id="ProblemPath" name="ProblemPath" />
                    <div id="picker6" class="uploader" data-type="file">
                        上传
                    </div>
                    <div class="uploader-show" data-mulit="true">

                    </div>
                </td>
            </tr>
            <tr>
                <th>产品占有率</th>
                <td>
                    <input type="text" data-rule-number="true" data-rule-required="true" value="0" id="ProductShare" name="ProductShare" />
                </td>
            </tr>

        </table>
    </div>
</form>
@section foot
{
    <script type="text/javascript">

        function SaveData(index) {
            if ($("#CompetitorAddform").valid()) {
                //表单序列化
                var dto = $('#CompetitorAddform').serializeArray();
                K.AjaxJson("@Url.Content("~/Customer/Competitor/CompetitorInsert")", dto, function (result) {
                    parent.K.layer.callback(index, result, dto);
                    parent.K.layer.close(index);
                });
            }

        }
    </script>
<script type="text/javascript">
    var uploaders = [];
    $(".uploader").each(function () {
        var that = $(this);
        var fileType = $(this).attr("data-type");
        var imgshow = that.parent().find(".uploader-show");
        var urlhidden = that.parent().find("input[type='hidden']");
        var pickid = "#" + that.prop("id");
        var ismulit = false;
        var fileInputName = "file";
        if (urlhidden) {
            fileInputName = urlhidden.prop("name");
        }
        if (imgshow.attr("data-mulit")) {
            ismulit = true;
        }

        var parameter = {
            swf: '@Url.Content("~/ScriptPlugin/webuploader/Uploader.swf")',
            server: '@Url.Content("~/Customer/CustomerInfo/UploaderProcess")',
            pick: {
                id: pickid,
                multiple: ismulit
            },
            resize: false,
            auto: true,
            fileVal: fileInputName
        };
        var eventer = {
            fileQueued: function (file) {
                if (fileType && fileType === "file") {
                    if (ismulit) {
                        imgshow.append("（<a>" + file.name + "</a>）");
                    } else {
                        imgshow.html("（<a>" + file.name + "</a>）");
                    }
                } else {
                    uploader.makeThumb(file, function (error, ret) {
                        if (error) {
                            imgshow.html("预览错误");
                        } else {
                            if (ismulit) {
                                imgshow.append("<div class=\"imgBox\"><img onclick=\"\" src=\"" + ret + "\" class=\"mulit\"  /><img onclick=\"removeImg($(this))\"  src=\"@Url.Content("~/Images/hongcha.png")\" class=\"hongcha\" /></div>");
                            } else {
                                imgshow.append("<div class=\"imgBox\"><img onclick=\"\" src=\"" + ret + "\"  /><img onclick=\"removeImg($(this))\"  src=\"@Url.Content("~/Images/hongcha.png")\" class=\"hongcha\" /></div>");
                            }
                        }
                    });
                }
            },
            uploadSuccess: function (file, response) {
                if (response.Filish) {
                    if (ismulit) {
                        var oldval = urlhidden.val();
                        if (oldval != "") {
                            oldval += ",";
                        }
                        urlhidden.val(oldval + response.Path);
                    } else {
                        urlhidden.val(response.Path);
                    }
                }
            },
            uploadError: function () {
                K.Alert("上传出错");
            }
        };
        if (fileType && fileType === "file") {
            var uploader = new K.Uploader().createFile(parameter, eventer);
            uploaders.push(uploader);
        } else {
            var uploader = new K.Uploader().createImage(parameter, eventer);
            uploaders.push(uploader);
        }
    });

    //查看大图
    function showBigImg(obj) {
        var json = {
            "data": [
                {
                    "src": obj.attr("src"), //原图地址
                }
            ]
        };
        layer.photos({
            photos: json
        });
    }
    //删除图片
    function removeImg(obj) {
        var imgUrlStr = obj.closest("td").find("input[type=hidden]");
        var imgUrlArr = imgUrlStr.val().split(",");
        imgUrlArr.splice(obj.parent().index(), 1);
        obj.parent().remove();
        K.Alert("删除成功");
        $("#" + imgUrlStr.attr("id")).val(imgUrlArr.toString());
    }
</script>



}